<template>
  <div class="child4">
    <p>子组件4</p>
    <p>玩具:{{ toy }}</p>
    <p>书籍:{{ book }}本</p>
    <button @click="miunHouse($parent)">干掉父亲一套房子</button>
  </div>
</template>

<script setup lang="ts" name="Childs4">
import { ref } from "vue";

const toy = ref("汽车");
const book = ref(5);

const changeToy = () => {
  toy.value = "跑车";
};

const miunHouse = (p: any) => {
  p.house -= 1;
};
defineExpose({ toy, book,changeToy });
</script>

<style scoped lang="scss">
.child4 {
  background-color: pink;
  padding: 10px;
}
</style>
